
<!-- BEGIN:main -->

<link rel="stylesheet" type="text/css" href="templates/default/plugin/content_slider/style.css" />
<script type="text/javascript" src="templates/default/plugin/content_slider/js/jquery-1.8.2.js" ></script>
<script type="text/javascript" src="templates/default/plugin/content_slider/js/jquery-ui-1.9.0.custom.min.js" ></script>
<script type="text/javascript" src="templates/default/plugin/content_slider/js/jquery-ui-tabs-rotate.js" ></script>


<script type="text/javascript">
    $(document).ready(function(){
        $("#featured").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 5000, true);
    });
</script>



<div class="d_component" style="float: left">

    <p class="d_title_component d_bold">Tin nổi bật</p>

    <div class="d_content_component">


        <div id="featured" >

            <ul class="ui-tabs-nav">
                <!-- BEGIN:small_content_list -->
                <li class="ui-tabs-nav-item" id="nav-fragment-1">
                    <a href="#fragment-{INDEX}">
                        <img style="" src="{IMAGE_LINK}" alt="{TITLE}" />
                        <span>{BRIEF_TITLE}</span>
                    </a>
                </li>
                <!-- END:small_content_list -->
            </ul>



            <!-- BEGIN:large_content_list -->
            <div id="fragment-{INDEX}" class="ui-tabs-panel">        
                <img src="{IMAGE_LINK}" alt="{TITLE}" />        
                <div class="info">
                    <h2><a href="./com_content/articles/{ARTICLE_ALIAS}/{ARTICLE_ID}.htm">{TITLE}</a></h2>
                    <!--<span><a href="./com_content/articles/{ARTICLE_ALIAS}/{ARTICLE_ID}.htm">xem thêm</a></span>-->
                </div>
            </div>
            <!-- END:large_content_list -->

        </div>
    </div>
</div>

<!-- END:main -->